<template>
<div class="Zi">
      <div class="zi2" v-for="(v,i) in data" :key="i">
         <img :src="v.img" alt="">
         <p>{{v.p}}</p>
     </div>
</div>
   
</template>

<script>
export default {
    created(){
        this.$emit("xiaoming",this.data)
    },
    data(){
        return{
            data:[{img:"/find/11.png",p:"最新预约"},
            {img:"/find/12.png",p:"最新测试"},
            {img:"/find/13.png",p:"最新独家"},]
        }
    }

}
</script>

<style scoped>
  .zi2{
      width: 1.0906rem;
      height: 0.5rem;
      background-color:#FFAA001A;
      display: flex;
      flex-direction: column;
      border-radius: 0.05rem;
      /* justify-content:space-between; */
      float: left;
      margin-left: 0.05rem;
      margin-top: 0.1rem;
  }
  .zi2 img{
      width: 0.28rem;
      height: 0.28rem;
      margin: auto;
  }
  .zi2 p{
     font-size: 0.12rem;
     margin: auto;
  }
  .Zi .zi2:nth-child(1){
        color: #FFAA00;
        background-color: #FFAA001A;
  }
  .Zi .zi2:nth-child(2){
       color: #1AB2FF;
       background-color: #1AB2FF1A;
  }
    .Zi .zi2:nth-child(3){
       color: #15C5CE;
       background-color: #15C5CE1A;
  }
</style>